<html>
<head>
<script src="js/highcharts.js"></script>
<script src="js/exporting.js"></script>
<script type="text/javascript">
	var aJaxURL	= "server-side/report/prod_category_statistics.action.php";		//server side folder url
	var url     = "server-side/report/prod_category_statistics/get_category_sum.php";
	var tName   = "report";

	Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function(color) {
	    return {
	        radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
	        stops: [
	            [0, color],
	            [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
	        ]
	    };
	});

	var options, options1;
	$(document).ready(function() {
		GetDate("search_start");
		GetDate("search_end");

		$("#search_start").val(GetDateTime(2));
		$("#search_end").val(GetDateTime(2));

		$("#back").button({
            icons: {
                primary: "ui-icon-arrowthick-1-w"
            }
    	});
		var start	= $("#search_start").val();
		var end		= $("#search_end").val();

	     drawFirstLevel(start,end);
	     $('#back').click(function(){
            var st	= $("#search_start").val();
      		var en		= $("#search_end").val();
	    	 $("#options1").remove();
	         drawFirstLevel(st,en);
	         GetCategorySum(st,en); 
	         LoadTable(start, end);               
	     });
	     
	     GetCategorySum(start,end);

	     LoadTable(start, end);

	});
	
	function LoadTable(start, end){

		/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
		GetDataTable(tName, "server-side/report/prod_category_statistics/get_category_list.php", "get_list", 4, "start=" + start + "&end=" + end, 0, "", 1, "desc");
	}
	
	function LoadTable2(name, start, end){

		/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
		GetDataTable(tName, "server-side/report/prod_category_statistics/get_category_list.php", "get_prod_list&name="+name, 4, "start=" + start + "&end=" + end, 0, "", 1, "desc");
	}

	
	$(document).on("change", "#search_start", function () {
		var start	= $(this).val();
		var end		= $("#search_end").val();
		var type	= chart.options.series[0].name; //კატეგორიების ჩარტია თუ  პროდუქტების დასადგენათ 
		var name    = $("#hidden_name").val();
		
		if(type == 'კატეგორიები'){
			drawFirstLevel(start,end);
			GetCategorySum(start,end);
			LoadTable(start, end);
		}else{
			drawSecondLevel(name, start, end);
			GetProductionSum(name, start, end);
			LoadTable2(name, start, end);
		}
		
	});
	
	$(document).on("change", "#search_end", function () {
		var start	= $("#search_start").val();
		var end		= $(this).val();
		var type	= chart.options.series[0].name; //კატეგორიების ჩარტია თუ  პროდუქტების დასადგენათ 
		var name    = $("#hidden_name").val();
		
		if(type == 'კატეგორიები'){
			drawFirstLevel(start,end);
			GetCategorySum(start,end);
			LoadTable(start, end);
		}else{
			drawSecondLevel(name, start, end);
			GetProductionSum(name, start, end);
			LoadTable2(name, start, end);
		}

	});

	 function drawFirstLevel(start,end){
		 

	        // Build the chart
		 var options = {
	                chart: {
	                    renderTo: 'chart_container',
	                    plotBackgroundColor: null,
	                    plotBorderWidth: null,
	                    plotShadow: false
	                },
	                title: {
	                    text: 'გაყიდვები კატეგორიების მიხედვით'
	                },
	                tooltip: {
	                    formatter: function() {
	                        return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
	                    }
	                },
	                plotOptions: {
	                	pie: {
	                        allowPointSelect: true,
	                        cursor: 'pointer',
	                        dataLabels: {
	                            enabled: true,
	                            color: '#000000',
	                            connectorColor: '#000000',
	                            formatter: function() {
	                                return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
	                            }
	                        },
	                        point: {
	                            events: {
	                                click: function() {
		                                var nm = this.name.split("<",1);
		                                $("#hidden_name").val(nm);
		                                var st	= $("#search_start").val();
		                        		var en		= $("#search_end").val();
	                                	drawSecondLevel(this.name, st, en);  
	                                	GetProductionSum(nm, st, en);
	                                	LoadTable2(nm, st, en);                      
	                                }
	                            }
	                        }
	                    }
	                },
	                series: [{
	                    type: 'pie',
	                    name: 'კატეგორიები',
	                    data: []
	                }]
	            }
	            
	            $.getJSON("server-side/report/prod_category_statistics.action.php?act=get_category&start="+start+"&end="+end, function(json) {
	                options.series[0].data = json;
	                chart = new Highcharts.Chart(options);
	            });
	 }
	 
	 function drawSecondLevel(name, start, end){
		 
		 $( "#options" ).remove();
		 var nm = name.split("<",1);
	     
		 var options1 = {
	                chart: {
	                    renderTo: 'chart_container',
	                    plotBackgroundColor: null,
	                    plotBorderWidth: null,
	                    plotShadow: false
	                },
	                title: {
	                    text: 'პროდუქტები'
	                },
	                tooltip: {
	                    formatter: function() {
	                        return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
	                    }
	                },
	                plotOptions: {
	                	pie: {
	                        allowPointSelect: true,
	                        cursor: 'pointer',
	                        dataLabels: {
	                            enabled: true,
	                            color: '#000000',
	                            connectorColor: '#000000',
	                            formatter: function() {
	                                return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
	                            }
	                        },
	                        point: {
	                            events: {
	                                click: function() {
	                                	                   
	                                }
	                            }
	                        }
	                    }
	                },
	                series: [{
	                    type: 'pie',
	                    name: 'პროდუქტები',
	                    data: []
	                }]
	            }
   
	            $.getJSON("server-side/report/prod_category_statistics.action.php?act=get_products&name="+nm+"&start="+start+"&end="+end, function(json) {
	                options1.series[0].data = json;
	                chart = new Highcharts.Chart(options1);
	            });
	 }

	 function GetCategorySum(start,end){

      	 $("#total_money").text("იტვირთება...");
      	 $("#total_quantity").text("იტვირთება...");
      	 
		 var param = new Object();
		 param.act ="get_category_sum";
		 param.start= start;
		 param.end = end;
		 	 
		 $.ajax({
				url: url,
				data: param,
				success: function(data) {
					if (typeof (data.error) != "undefined") {
                  if (data.error != "") {
                      alert(data.error);
                  } else { 
                  	 $("#total_money").text(data.page[0]);
                  	 $("#total_quantity").text(data.page[1]);
                  }
              }
				}
			});
	 }

	 function GetProductionSum(name, start, end){
		 
		 var param = new Object();
		 var nm = name.toString();
		 param.act ="get_products_sum";
		 param.name = nm;
		 param.start = start;
		 param.end = end;
		 
			$.ajax({
				url: url,
				data: param,
				success: function(data) {
					if (typeof (data.error) != "undefined") {
                        if (data.error != "") {
                            alert(data.error);
                        } else { 
                        	$("#total_money").text(data.page[0]);
                       		$("#total_quantity").text(data.page[1]);
                        }
                    }
				}
			});
	 }


	</script>
	</head>
	<body>

      <div id="dt_example" class="ex_highlight_row">
       	 <div id="container" style="width:90%">
            <div id="dynamic">
             <div id="button_area" style="margin: 3% 0 0 0">
             <button id="back" style="margin-top:0px">უკან</button>
			</div>
	       <div id="button_area" style="margin: 3% 0 0 0">
	         <div class="left" style="width: 175px;">
	           <input type="text" name="search_start" id="search_start" class="inpt right"/>
	             </div>
	            	<label for="search_start" class="left" style="margin:5px 0 0 3px">-დან</label>
	             <div class="left" style="width: 185px;">
		            <input type="text" name="search_end" id="search_end" class="inpt right" />
	             </div>
	            	<label for="search_end" class="left" style="margin:5px 0 0 3px">–მდე</label>
	             <label class="left" style="margin:5px 0 0 40px">ჯამური თანხა: </label> <label id="total_money" class="left" style="margin:5px 0 0 2px; font-weight: bold;"></label>
	              <label class="left" style="margin:5px 0 0 40px">ჯამური რაოდენობა: </label> <label id="total_quantity" class="left" style="margin:5px 0 0 2px; font-weight: bold;">5</label>
	       <br /><br /><br />
	            </div>
			<div id="chart_container" style="width: 100%; height: 480px; margin-top:-30px;"></div>
			<input type="text" id="hidden_name" value="" style="display: none;" />
			<br><br><br><br><br><br><br><br><br><br>

			 <table class="display" id="report">
                    <thead>
                        <tr id="datatable_header">
                            <th>ID</th>
                            <th style="width:100%">დასახელება</th>
                            <th class="min">თანხა</th>
                            <th class="min">რაოდენობა</th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="search_header">
                            <th class="colum_hidden">
                            	<input type="text" name="search_id" value="ფილტრი" class="search_init" />
                            </th>
                            <th>
                            	<input type="text" name="search_number" value="ფილტრი" class="search_init">
                            </th>
                            <th>
                            	<input type="text" name="search_object" value="ფილტრი" class="search_init">
                            </th>
                            <th>
                                <input type="text" name="search_date" value="ფილტრი" class="search_init" />
                            </th>

                        </tr>
                    </thead>
                    <tfoot>
                        <tr>
                            <th>&nbsp;</th>
                            <th>&nbsp;</th>
                            <th>&nbsp;</th>
                            <th id="qnt">&nbsp;</th>
                        </tr>
                    </tfoot>
                </table>
                 <div class="spacer">
            	</div>
		</div>
	</div>
  </div>
</body>
</html>
